<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Table to json converter</title>
    <style>
        
        textarea {
            width: 600px;
            height: 350px;
        }
    </style>
    <script>
        function convert() {
            text = document.getElementById("input1").value;
        
            if(document.getElementById("int1").checked) {

                text = text.replace(/^/gm, '"');
                text = text.replace(/\t|,|, /gm, '": ');
                text = text.replace(/$/gm, ',');
                
            } else {
                
                text = text.replace(/^/gm, '"');
                text = text.replace(/\t|,|, /gm, '": "');
                text = text.replace(/$/gm, '",');
             
            }
            text = text.replace(/^""(: ,|: "",)$/gm, '},');
            text = text.replace(/(: ,|: "",)$/gm, ': {');

            text = text.replace(/,\n(?!")/gm, '\n');

            text = text.substr(0, text.length-1);

            document.getElementById("output1").value = text;
        }
        </script>

</head>
<body>
    <h1>Table to json thingy</h1>
    <pre>If you copy and pase a 2-column table from google sheets, excel or similar, this will crudely attempt to parse this to JSON key:value pairs in order to more conveniently create block property lists.</pre>
    <pre>Relies on columns being separated by tab characters (&Tab;) or commas ("," or ", "), and rows being separated with newlines.</pre>
    <pre>Also supports nested tables for properties with different values for different variants when using some fancier formatting that I can't be arsed to explain in this paragraph.</pre>
    <br>
    <textarea onkeyup="convert();" id="input1"></textarea>
    <input type="checkbox" id="int1" oninput="convert();">Int?</input>
    <textarea id="output1"></textarea>
    <br>
    
    <script>
        function convertReverseTable() {
            text = document.getElementById("input2").value;
            var output = "";
            text.split('\n').forEach(row => {
                columns = row.split(/, |\t/);
                value = columns.shift();
                for(let i in columns){
                    if(columns[i]!='') output += `"${columns[i]}": "${value}",\n`;
                };
            });
            document.getElementById("output2").value = output.substr(0, output.length-2);
        }
    </script>
    <textarea onkeyup="convertReverseTable();" id="input2"></textarea>
    <textarea id="output2"></textarea>
</body>
</html>